<template>
  <div class="Index">
   <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
    <van-swipe-item>1</van-swipe-item>
    <van-swipe-item>2</van-swipe-item>
    <van-swipe-item>3</van-swipe-item>
    <van-swipe-item>4</van-swipe-item>
  </van-swipe>
    <router-view />
  
  </div>
</template>

<script lang="ts">
import { defineComponent, ref   } from "vue";
import { useRouter } from "vue-router";
export default defineComponent({
  name: "Index",
  components: {},
  setup() {
    const router = useRouter();
    var  nowPath = router.currentRoute.value.fullPath
    var active = ref(0);
    if (nowPath==="/home") {
        active=ref(0)
    }else if(nowPath==="/like"){
        active=ref(1)
    }else if(nowPath==="/userCon"){
        active=ref(2)   
    }
    return { active };
  },
});
</script>
<style lang="less">
#app,html,body{
    height: 100%;
    width: 100%;
}
.Index{
    height: 100%;
    padding: 0 4rem;
}
.my-swipe{
  border-radius: 5px;
}
  .my-swipe .van-swipe-item {
    color: #fff;
    font-size: 20px;
    line-height: 150px;
    text-align: center;
    background-color: #39a9ed;
  }
</style>
